import React, {useEffect, useState} from 'react';

export default () => {
  const [count, setCount] = useState({number:0});

  /** 你会发现每次点击,这里的effect都会触发*/
  useEffect(() => {
    console.log('trigger effect')
  }, [count/** ←全等比较(基本类型比较值, 引用类型比较地址),你会发现每次渲染都会打印↑的,而其实我们只有第一次点击改变了count.number的值,后面都是一样的,都是1,但react仍然认为它改变了*/]);
  // 类似的还有 useCallback、useImperativeHandle...任何有deps的hook

  console.log('render');

  return (
    <div>
      <p>{count.number}</p>
      <button onClick={()=>setCount({number:1})}>button</button>
    </div>
  )
};
